<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta content="width=device-width,initial-scale=1.0, user-scalable=no" name="viewport"/>
    <meta content="yes" name=" apple-mobile-web-app-capable"/>
    <meta content="no" name="apple-touch-fullscreen"/>
    <meta content="black" name=" apple-mobile-web-app-status-bar-style"/>
    <meta content="telephone=no" name="format-detection"/>
    <title>小程序商城</title>
    <script src="../js/base.min.js"></script>
    <link rel="stylesheet" href="../css/index.css"/>
    <link rel="stylesheet" href="//at.alicdn.com/t/font_983752_gxio5wwcuoh.css"/>
</head>
<body>

<!--头部开始-->
<header flex="main:center cross:center">
    <span>剁手一组.二组</span>
    <div flex="cross:center">
        <i class="iconfont icon-gengduo1"></i>
        <span class="line"></span>
        <i class="iconfont icon-dian"></i>
    </div>
</header>
<!--头部结束-->

<!--banner开始-->
<section class="banner" flex="main:center">
    <div flex="cross:center">
        <i class="iconfont icon-sousuo"></i>
        <input type="text" placeholder="请输入关键词进行搜索"/>
    </div>
</section>
<!--banner结束-->

<!--入口导航开始-->
<ul class="navTop">
    <li>
        <div flex="main:center cross:center">
            <i class="iconfont icon-biaoqian-"></i>
        </div>
        <span>随便写的</span>
    </li>
    <li>
        <div flex="main:center cross:center">
            <i class="iconfont icon-wanweiyaomedicines"></i>
        </div>
        <span>坚果炒货</span>
    </li>
    <li>
        <div flex="main:center cross:center">
            <i class="iconfont icon-shaguo"></i>
        </div>
        <span>干果蜜饯</span>
    </li>
    <li>
        <div flex="main:center cross:center">
            <i class="iconfont icon-jianlou_yaoyiyao_zishahu"></i>
        </div>
        <span>干果蜜饯</span>
    </li>
    <li>
        <div flex="main:center cross:center">
            <i class="iconfont icon-qiandai"></i>
        </div>
        <span>糖果糕点</span>
    </li>
    <li>
        <div flex="main:center cross:center">
            <i class="iconfont icon-miguan"></i>
        </div>
        <span>五谷杂粮</span>
    </li>
    <li>
        <div flex="main:center cross:center">
            <i class="iconfont icon-binggan"></i>
        </div>
        <span>饼干膨化</span>
    </li>
    <li>
        <div flex="main:center cross:center">
            <i class="iconfont icon-gengduo"></i>
        </div>
        <span>优惠专区</span>
        <p class="tag" flex="main:center cross:center">-40%</p>
    </li>
</ul>
<!--入口导航结束-->

<!--banner2开始-->
<section class="banner2"></section>
<!--banner3结束-->

<!--优惠促销开始-->
<ul class="sale">
    <li class="sale1">
        <p class="t1" flex="cross:center">
            优惠券<span>限时领取</span>
        </p>
        <p class="t3">刷新超低折扣价</p>
        <span class="tag" flex="main:center cross:center">-50%</span>
        <div class="pic1">
            <span class="p1"></span>
            <span class="p2"></span>
        </div>
    </li>
    <li class="sale1">
        <p class="t1" flex="cross:center">
            限时抢购<span>售完为止</span>
        </p>
        <p class="t3">打破电商价格壁垒</p>
        <div class="pic1">
            <span class="p3"></span>
            <span class="p4"></span>
        </div>
    </li>
    <li class="sale2">
        <div>
            <p class="t2">农庄有趣</p>
            <p class="t3">当季蔬果抢鲜</p>
        </div>
        <span class="p5"></span>
    </li>
    <li class="sale2">
        <div>
            <p class="t2">积分兑换</p>
            <p class="t3">免费领好物</p>
        </div>
        <span class="p6"></span>
    </li>
    <li class="sale2">
        <div>
            <p class="t2">一元拼团</p>
            <p class="t3">拼团享低价</p>
        </div>
        <span class="p7"></span>
    </li>
    <li class="sale2">
        <div>
            <p class="t2">七折直销</p>
            <p class="t3">买到就是赚到</p>
        </div>
        <span class="p8"></span>
    </li>
</ul>
<!--优惠促销结束-->

<!--商城论坛开始-->
<section class="comment">
    <div>
        <span class="sclt"></span>
        <p flex="main:left cross:center">
            <span class="rp" flex="cross:center main:center">热评</span>风味熟食-就爱这肉感！即食原味麻辣香辣牛...
        </p>
        <p flex="main:left cross:center">
            <span class="rp" flex="cross:center main:center">热评</span>峰巢蜜蜂蜜天然野生蜂巢盒装纯农家自产新...
        </p>
    </div>
</section>
<!--商城论坛结束-->

<!--视频播放开始-->
<section class="vedio" flex="cross:center main:center">
    <div>
        <i class="iconfont icon-bofang"></i>
        <p>播放视频</p>
    </div>
</section>
<!--视频播放结束-->

<!--掌柜推荐开始-->
<section class="recommend">
    <div class="head" flex="cross:center">
        <span class="red"></span>
        <span>掌柜推荐</span>
        <span class="eng">High quality recommendation</span>
    </div>
    <ul>
        <li class="rec1" flex="main:justify cross:center">
            <span class="p9"></span>
            <div flex="cross:center dir:top">
                <p class="t4">原生态野百花蜜</p>
                <p class="t5">森农良品</p>
                <p class="t6">福建连城特产美食</p>
            </div>
            <span class="p10"></span>
            <div flex="cross:center dir:top">
                <p class="t4">盛耳银耳白木耳</p>
                <p class="t5">象湖人家</p>
                <p class="t6">福建银耳干货</p>
            </div>
        </li>
        <li class="rec2" flex="main:justify">
            <div>
                <p class="t7">东北野生猴头菇</p>
                <p class="t5">健康美味干货</p>
                <div flex="main:justify cross:bottom">
                    <span class="p11"></span>
                    <span class="p12"></span>
                </div>
            </div>
            <div>
                <p class="t7">特产黑木耳干货</p>
                <p class="t5">农家自产</p>
                <div flex="main:justify cross:bottom">
                    <span class="p13"></span>
                    <span class="p14"></span>
                </div>
            </div>
        </li>
        <li class="rec2" flex="main:justify">
            <div>
                <p class="t7">农家豆干</p>
                <p class="t5">漳平特产</p>
                <div flex="main:justify cross:bottom">
                    <span class="p15"></span>
                    <span class="p16"></span>
                </div>
            </div>
            <div>
                <p class="t7">草菇食用菌</p>
                <p class="t5">个大肉厚</p>
                <div flex="main:justify cross:bottom">
                    <span class="p17"></span>
                    <span class="p18"></span>
                </div>
            </div>
        </li>
    </ul>
</section>
<!--掌柜推荐结束-->

<!--热销排行开始-->
<section class="recommend">
    <div class="head" flex="cross:center">
        <span class="red"></span>
        <span>热销排行</span>
        <span class="eng">Top selling</span>
    </div>
    <ul>
        <li class="rec2" flex="main:justify">
            <div>
                <p class="t7">大井头青豆腐竹</p>
                <p class="t5">健康美味干货</p>
                <div flex="main:justify cross:bottom">
                    <span class="p19"></span>
                    <span class="p20"></span>
                </div>
            </div>
            <div>
                <p class="t7">秘制辣猪肉条</p>
                <p class="t5">美味香辣</p>
                <div flex="main:justify cross:bottom">
                    <span class="p21"></span>
                    <span class="p22"></span>
                </div>
            </div>
        </li>
        <li class="rec2" flex="main:justify">
            <div>
                <p class="t7">客家炒米粉</p>
                <p class="t5">手工米线</p>
                <div flex="main:justify cross:bottom">
                    <span class="p23"></span>
                    <span class="p24"></span>
                </div>
            </div>
            <div>
                <p class="t7">麻辣香辣牛肉丝</p>
                <p class="t5">龙岩特产</p>
                <div flex="main:justify cross:bottom">
                    <span class="p25"></span>
                    <span class="p26"></span>
                </div>
            </div>
        </li>
    </ul>
</section>
<!--热销排行结束-->

<!--底部导航开始-->
<ul class="nav" flex="main:justify">
    <li flex="dir:top cross:center main:center">
        <i class="iconfont icon-shouye1"></i>
        <span>首页</span>
    </li>
    <li flex="dir:top cross:center main:center">
        <i class="iconfont icon-category"></i>
        <span>分类</span>
    </li>
    <li flex="dir:top cross:center main:center">
        <i class="iconfont icon-gouwuche"></i>
        <span>购物车</span>
    </li>
    <li flex="dir:top cross:center main:center">
        <i class="iconfont icon-user-1"></i>
        <span>个人中心</span>
    </li>
</ul>
<!--底部导航结束-->


<!--ios的active-->
<script>
    document.body.addEventListener('touchstart', function () {
    });
</script>
</body>
</html>